Portal Feature: changes to ai/mcp page to add buttons for downloading #7890
Conversation
|
WalkthroughAdds deep-link install buttons for Cursor and VS Code to the MCP docs page, imports Button/ArrowDownIcon/Link UI components, wraps install links with Button asChild, and standardizes MCP secret placeholders to YOUR_SECRET_KEY_HERE across code samples (Claude, LangChain, and server config blocks). Changes
Sequence Diagram(s)sequenceDiagram
autonumber
actor User
participant Docs as "MCP Docs Page"
participant Browser
participant Editor as "Cursor / VS Code"
User->>Docs: Click "Install into Cursor" / "Install into VS Code"
Docs->>Browser: Open deep-link URL (cursor://... or vscode://...)
Browser->>Editor: Invoke protocol handler for installation
Editor-->>User: Prompt or execute MCP install flow
Note right of Docs: Docs also includes updated code samples using YOUR_SECRET_KEY_HERE
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Tip 🔌 Remote MCP (Model Context Protocol) integration is now available!Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats. Warning Review ran into problems🔥 ProblemsErrors were encountered while retrieving linked issues. Errors (1)
✨ Finishing Touches🧪 Generate unit tests
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR/Issue comments)Type Other keywords and placeholders
CodeRabbit Configuration File (
|
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
How to use the Graphite Merge QueueAdd either label to this PR to merge it via the merge queue:
You must have a Graphite account in order to use the merge queue. Sign up using this link. An organization admin has enabled the Graphite Merge Queue in this repository. Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue. |
github-actions
bot
added
the
Portal
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #7890 +/- ##
=======================================
Coverage 56.53% 56.53%
=======================================
Files 904 904
Lines 58592 58592
Branches 4143 4143
=======================================
Hits 33126 33126
Misses 25360 25360
Partials 106 106
🚀 New features to boost your workflow:
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
apps/portal/src/app/ai/mcp/page.mdx (1)
89-99: VS Code JSON sample: fix invalid JSON (trailing comma) and ensure naming consistency
- Remove trailing comma after url.
- Ensure the key ("thirdweb-api") matches the deeplink name to avoid confusion.
Apply this diff:
- "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE", + "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE"
🧹 Nitpick comments (1)
apps/portal/src/app/ai/mcp/page.mdx (1)
46-52: Standardize secret key placeholder across the entire pageYou switched to YOUR_SECRET_KEY_HERE here (good), but earlier sections still use (Remote MCP endpoint) and the LangChain example also uses the old placeholder. Please align all samples to the same placeholder to avoid confusion.
Outside this hunk, update these snippets:
https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE# in the LangChain sample "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE",
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
apps/portal/src/app/ai/mcp/page.mdx(5 hunks)
🧰 Additional context used
🧠 Learnings (4)
📚 Learning: 2025-07-18T19:19:55.613Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-07-18T19:19:55.613Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{ts,tsx} : Import UI primitives from `@/components/ui/*` (Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in dashboard and playground apps
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Prefer composable primitives over custom markup: `Button`, `Input`, `Select`, `Tabs`, `Card`, `Sidebar`, `Separator`, `Badge`.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Use `NavLink` (`@/components/ui/NavLink`) for internal navigation so active states are handled automatically.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Always import from the central UI library under `@/components/ui/*` – e.g. `import { Button } from "@/components/ui/button"`.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
🪛 LanguageTool
apps/portal/src/app/ai/mcp/page.mdx
[grammar] ~2-~2: There might be a mistake here.
Context: ... Button } from "@/components/ui/button"; import { ArrowDownIcon } from "lucide-re...
(QB_NEW_EN)
[grammar] ~3-~3: There might be a mistake here.
Context: ...t { ArrowDownIcon } from "lucide-react"; import Link from "next/link"; # MCP ser...
(QB_NEW_EN)
[grammar] ~35-~35: There might be a mistake here.
Context: ...> <Button asChild className="flex items-center g...
(QB_NEW_EN)
[grammar] ~36-~36: There might be a mistake here.
Context: ...ntent value="cursor"> <Button asChild className="flex items-center gap-3 bg-ca...
(QB_NEW_EN)
[grammar] ~37-~37: There might be a mistake here.
Context: ...er:shadow-lg transition-shadow border-2" variant="outline" > <Link href="cursor...
(QB_NEW_EN)
[grammar] ~78-~78: There might be a mistake here.
Context: ...> <Button asChild className="flex items-center g...
(QB_NEW_EN)
[grammar] ~79-~79: There might be a mistake here.
Context: ...ntent value="vscode"> <Button asChild className="flex items-center gap-3 bg-ca...
(QB_NEW_EN)
[grammar] ~80-~80: There might be a mistake here.
Context: ...er:shadow-lg transition-shadow border-2" variant="outline" > <Link href="https:...
(QB_NEW_EN)
🔇 Additional comments (3)
apps/portal/src/app/ai/mcp/page.mdx (3)
2-4: UI imports look correct and consistent with our UI library usageButton from "@/components/ui/button", lucide-react icons, and next/link in MDX are appropriate here.
35-45: Button-asChild wrapping Link is a good pattern for deep-link CTAsClean usage with ArrowDownIcon and outline variant. LGTM.
105-109: Claude Code CLI instructions look goodCommand uses the unified placeholder and matches the other samples.
size-limit report 📦
|
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (2)
apps/portal/src/app/ai/mcp/page.mdx (2)
64-72: Fix invalid JSON (trailing comma) in Windsurf sample
The trailing comma after the "url" makes the JSON invalid.- "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE", + "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE"
78-87: VS Code deep-link: align name, include secret placeholder, and open safely
- name should match other sections (“thirdweb-api”).
- Include the secret placeholder in the config URL so installed server works immediately.
- Open in a new tab with rel attrs for safety.
- <Link href="https://vscode.dev/redirect/mcp/install?name=thirdweb&config=%7B%22type%22%3A%22http%22%2C%22url%22%3A%22https%3A%2F%2Fapi.thirdweb.com%2Fmcp%22%7D" className="flex items-center gap-3"> + <Link href="https://vscode.dev/redirect/mcp/install?name=thirdweb-api&config=%7B%22type%22%3A%22http%22%2C%22url%22%3A%22https%3A%2F%2Fapi.thirdweb.com%2Fmcp%3FsecretKey%3DYOUR_SECRET_KEY_HERE%22%7D" target="_blank" rel="noreferrer noopener" className="flex items-center gap-3">
🧹 Nitpick comments (3)
apps/portal/src/app/ai/mcp/page.mdx (3)
15-16: Standardize secret placeholder to YOUR_SECRET_KEY_HEREOne instance still uses . Align with the rest of the page to avoid confusion.
-https://api.thirdweb.com/mcp?secretKey=<your-project-secret-key> +https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE
121-136: Standardize placeholder in the LangChain example
This example still uses . Align with the page-wide placeholder for consistency.- "url": "https://api.thirdweb.com/mcp?secretKey=<your-project-secret-key>", + "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE",
28-28: Cosmetic: use official capitalization “Windsurf”
Minor label polish for brand consistency.-<TabsTrigger value="windsurf">WindSurf</TabsTrigger> +<TabsTrigger value="windsurf">Windsurf</TabsTrigger>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
apps/portal/src/app/ai/mcp/page.mdx(5 hunks)
🧰 Additional context used
🧠 Learnings (4)
📚 Learning: 2025-07-18T19:19:55.613Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-07-18T19:19:55.613Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{ts,tsx} : Import UI primitives from `@/components/ui/*` (Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in dashboard and playground apps
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Prefer composable primitives over custom markup: `Button`, `Input`, `Select`, `Tabs`, `Card`, `Sidebar`, `Separator`, `Badge`.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Use `NavLink` (`@/components/ui/NavLink`) for internal navigation so active states are handled automatically.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Always import from the central UI library under `@/components/ui/*` – e.g. `import { Button } from "@/components/ui/button"`.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
🪛 LanguageTool
apps/portal/src/app/ai/mcp/page.mdx
[grammar] ~2-~2: There might be a mistake here.
Context: ... Button } from "@/components/ui/button"; import { ArrowDownIcon } from "lucide-re...
(QB_NEW_EN)
[grammar] ~3-~3: There might be a mistake here.
Context: ...t { ArrowDownIcon } from "lucide-react"; import Link from "next/link"; # MCP ser...
(QB_NEW_EN)
[grammar] ~35-~35: There might be a mistake here.
Context: ...> <Button asChild className="flex items-center g...
(QB_NEW_EN)
[grammar] ~36-~36: There might be a mistake here.
Context: ...ntent value="cursor"> <Button asChild className="flex items-center gap-3 bg-ca...
(QB_NEW_EN)
[grammar] ~37-~37: There might be a mistake here.
Context: ...er:shadow-lg transition-shadow border-2" variant="outline" > <Link href="cursor...
(QB_NEW_EN)
[grammar] ~78-~78: There might be a mistake here.
Context: ...> <Button asChild className="flex items-center g...
(QB_NEW_EN)
[grammar] ~79-~79: There might be a mistake here.
Context: ...ntent value="vscode"> <Button asChild className="flex items-center gap-3 bg-ca...
(QB_NEW_EN)
[grammar] ~80-~80: There might be a mistake here.
Context: ...er:shadow-lg transition-shadow border-2" variant="outline" > <Link href="https:...
(QB_NEW_EN)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (6)
- GitHub Check: E2E Tests (pnpm, vite)
- GitHub Check: E2E Tests (pnpm, esbuild)
- GitHub Check: Size
- GitHub Check: Unit Tests
- GitHub Check: Lint Packages
- GitHub Check: Analyze (javascript)
🔇 Additional comments (4)
apps/portal/src/app/ai/mcp/page.mdx (4)
2-4: UI imports and primitives look goodUsing Button from the shared UI library and lucide-react icons is consistent with our UI pattern. Link from next/link is appropriate for anchors.
35-45: Nice UX: “Install into Cursor” buttonThe asChild Button + Link pattern and encoded config look good. The payload decodes to the expected URL with the placeholder. No action needed.
105-109: Claude Code instructions: good and consistent
Command uses the standardized placeholder and matches the server name used elsewhere. LGTM.
83-83: Optional: verify Cursor deeplink schema expectations
VS Code’s config includes a "type":"http" field; Cursor’s deeplink encodes only a URL. If Cursor requires a type as well, the deeplink may fail silently.Would you like me to provide a base64-encoded config that includes {"type":"http","url":"..."} if Cursor expects parity with VS Code?
apps/portal/src/app/ai/mcp/page.mdx
Outdated
| "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE | ||
| } |
There was a problem hiding this comment.
Fix broken JSON in VS Code sample (missing closing quote)
The URL string isn’t closed, making the snippet invalid.
- "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE
+ "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE"📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE | |
| } | |
| "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE" | |
| } |
🤖 Prompt for AI Agents
In apps/portal/src/app/ai/mcp/page.mdx around lines 95 to 96, the JSON example
has a missing closing quote on the "url" value making the snippet invalid; fix
it by adding the terminating double quote after the URL and ensure the
surrounding JSON punctuation remains correct so the sample parses as valid JSON.
There was a problem hiding this comment.
Actionable comments posted: 0
♻️ Duplicate comments (3)
apps/portal/src/app/ai/mcp/page.mdx (3)
64-72: Fix invalid JSON in Windsurf sample (trailing comma).The trailing comma makes the JSON invalid.
Apply this diff:
"mcpServers": { "thirdweb-api": { - "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE", + "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE" } }
91-99: VS Code sample JSON: fix missing closing quote on URL.Currently the URL string isn’t closed, breaking JSON validity.
Apply this diff:
"mcp.servers": { "thirdweb-api": { - "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE + "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE" } }
78-87: VS Code deep-link: include secret placeholder and open safely in new tab.The config in the href omits the secret parameter; also consider target/rel for safety when opening external links.
Apply this diff:
- <Link href="https://vscode.dev/redirect/mcp/install?name=thirdweb-api&config=%7B%22type%22%3A%22http%22%2C%22url%22%3A%22https%3A%2F%2Fapi.thirdweb.com%2Fmcp%22%7D" className="flex items-center gap-3"> + <Link + href="https://vscode.dev/redirect/mcp/install?name=thirdweb-api&config=%7B%22type%22%3A%22http%22%2C%22url%22%3A%22https%3A%2F%2Fapi.thirdweb.com%2Fmcp%3FsecretKey%3DYOUR_SECRET_KEY_HERE%22%7D" + target="_blank" + rel="noreferrer noopener" + className="flex items-center gap-3" + >
🧹 Nitpick comments (3)
apps/portal/src/app/ai/mcp/page.mdx (3)
91-99: Optional: include transport/type in VS Code JSON for parity with the deep-link.Not strictly required if the extension infers HTTP, but adding it improves clarity and consistency with the install link.
Apply this diff:
"mcp.servers": { "thirdweb-api": { + "type": "http", "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE" } }
121-131: LangChain example: standardize the secret placeholder.Replace the angle-bracket placeholder with YOUR_SECRET_KEY_HERE to match the rest of the doc.
Apply this diff:
- "url": "https://api.thirdweb.com/mcp?secretKey=<your-project-secret-key>", + "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE",
14-16: Update stale secret placeholders inapps/portal/src/app/ai/mcp/page.mdxThe grep results show two remaining instances of the old
<your-project-secret-key>placeholder at lines 15 and 129. Please replace both with the standardizedYOUR_SECRET_KEY_HEREfor consistency:• Line 15 (HTTP snippet)
• Line 129 (JSON snippet)Apply this diff:
--- a/apps/portal/src/app/ai/mcp/page.mdx +++ b/apps/portal/src/app/ai/mcp/page.mdx @@ -12,7 +12,7 @@ ```http -https://api.thirdweb.com/mcp?secretKey=<your-project-secret-key> +https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE@@ -126,7 +126,7 @@
"url": "https://api.thirdweb.com/mcp?secretKey=",
"url": "https://api.thirdweb.com/mcp?secretKey=<your-project-secret-key>",
"url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE",
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
apps/portal/src/app/ai/mcp/page.mdx(5 hunks)
🧰 Additional context used
🧠 Learnings (4)
📚 Learning: 2025-07-18T19:19:55.613Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-07-18T19:19:55.613Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{ts,tsx} : Import UI primitives from `@/components/ui/*` (Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in dashboard and playground apps
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Prefer composable primitives over custom markup: `Button`, `Input`, `Select`, `Tabs`, `Card`, `Sidebar`, `Separator`, `Badge`.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Use `NavLink` (`@/components/ui/NavLink`) for internal navigation so active states are handled automatically.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Always import from the central UI library under `@/components/ui/*` – e.g. `import { Button } from "@/components/ui/button"`.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
🪛 LanguageTool
apps/portal/src/app/ai/mcp/page.mdx
[grammar] ~2-~2: There might be a mistake here.
Context: ... Button } from "@/components/ui/button"; import { ArrowDownIcon } from "lucide-re...
(QB_NEW_EN)
[grammar] ~3-~3: There might be a mistake here.
Context: ...t { ArrowDownIcon } from "lucide-react"; import Link from "next/link"; # MCP ser...
(QB_NEW_EN)
[grammar] ~35-~35: There might be a mistake here.
Context: ...> <Button asChild className="flex items-center g...
(QB_NEW_EN)
[grammar] ~36-~36: There might be a mistake here.
Context: ...ntent value="cursor"> <Button asChild className="flex items-center gap-3 bg-ca...
(QB_NEW_EN)
[grammar] ~37-~37: There might be a mistake here.
Context: ...er:shadow-lg transition-shadow border-2" variant="outline" > <Link href="cursor...
(QB_NEW_EN)
[grammar] ~78-~78: There might be a mistake here.
Context: ...> <Button asChild className="flex items-center g...
(QB_NEW_EN)
[grammar] ~79-~79: There might be a mistake here.
Context: ...ntent value="vscode"> <Button asChild className="flex items-center gap-3 bg-ca...
(QB_NEW_EN)
[grammar] ~80-~80: There might be a mistake here.
Context: ...er:shadow-lg transition-shadow border-2" variant="outline" > <Link href="https:...
(QB_NEW_EN)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (8)
- GitHub Check: E2E Tests (pnpm, esbuild)
- GitHub Check: E2E Tests (pnpm, webpack)
- GitHub Check: E2E Tests (pnpm, vite)
- GitHub Check: Unit Tests
- GitHub Check: Size
- GitHub Check: Lint Packages
- GitHub Check: Build Packages
- GitHub Check: Analyze (javascript)
🔇 Additional comments (3)
apps/portal/src/app/ai/mcp/page.mdx (3)
2-4: UI imports are on-spec with our shared primitives.Good use of Button from "@/components/ui/button" and lucide-react icons; aligns with our retrieved learnings for portal apps.
35-44: Cursor deep-link button looks correct.The base64-encoded config decodes to a URL containing YOUR_SECRET_KEY_HERE and the server name matches “thirdweb-api”. Good use of Button asChild.
105-109: Claude Code CLI snippet LGTM.Uses YOUR_SECRET_KEY_HERE consistently and the command format looks right.
There was a problem hiding this comment.
Actionable comments posted: 0
♻️ Duplicate comments (3)
apps/portal/src/app/ai/mcp/page.mdx (3)
60-74: Windsurf sample JSON now valid (trailing comma removed).This resolves the earlier lint concern about invalid JSON.
89-99: VS Code manual config JSON is correct and consistent.Also nice catch fixing the previously missing closing quote—JSON is valid now.
78-87: VS Code deep-link: move the secret into the URL and standardize the placeholder.The current deeplink uses a separate "secret" field and the placeholder "YOUR_SECRET", but the rest of the docs (and our server) expect the key to be passed as a query param: secretKey=YOUR_SECRET_KEY_HERE. As written, the installed server likely won’t have the secret applied, leading to immediate auth errors.
Action:
- Put the secret in the config.url query string.
- Standardize the placeholder to YOUR_SECRET_KEY_HERE for consistency.
- <Link href="https://vscode.dev/redirect/mcp/install?name=thirdweb-api&config=%7B%22type%22%3A%22http%22%2C%22url%22%3A%22https%3A%2F%2Fapi.thirdweb.com%2Fmcp%22%2C%22secret%22%3A%22YOUR_SECRET%22%7D" className="flex items-center gap-3" target="_blank" rel="noopener noreferrer"> + <Link + href="https://vscode.dev/redirect/mcp/install?name=thirdweb-api&config=%7B%22type%22%3A%22http%22%2C%22url%22%3A%22https%3A%2F%2Fapi.thirdweb.com%2Fmcp%3FsecretKey%3DYOUR_SECRET_KEY_HERE%22%7D" + className="flex items-center gap-3" + target="_blank" + rel="noopener noreferrer" + >
🧹 Nitpick comments (4)
apps/portal/src/app/ai/mcp/page.mdx (4)
35-45: Nice addition: Cursor deep-link button UX is solid.
- asChild usage is correct, styling matches our button patterns.
- The base64-encoded config includes the secretKey placeholder—good.
Optional: add an aria-label on the Link for improved a11y.
- <Link href="cursor://anysphere.cursor-deeplink/mcp/install?name=thirdweb-api&config=eyJ1cmwiOiJodHRwczovL2FwaS50aGlyZHdlYi5jb20vbWNwP3NlY3JldEtleT1ZT1VSX1NFQ1JFVF9LRVlfSEVSRSJ9" className="flex items-center gap-3"> + <Link + href="cursor://anysphere.cursor-deeplink/mcp/install?name=thirdweb-api&config=eyJ1cmwiOiJodHRwczovL2FwaS50aGlyZHdlYi5jb20vbWNwP3NlY3JldEtleT1ZT1VSX1NFQ1JFVF9LRVlfSEVSRSJ9" + className="flex items-center gap-3" + aria-label="Install the thirdweb MCP server into Cursor" + >
14-16: Standardize the placeholder in the Remote MCP endpoint snippet.Elsewhere in the doc you switched to YOUR_SECRET_KEY_HERE. Recommend updating this block for consistency and to avoid user confusion.
-https://api.thirdweb.com/mcp?secretKey=<your-project-secret-key> +https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE
125-131: Standardize the placeholder in the LangChain example.Keep the placeholder consistent across all samples.
- "url": "https://api.thirdweb.com/mcp?secretKey=<your-project-secret-key>", + "url": "https://api.thirdweb.com/mcp?secretKey=YOUR_SECRET_KEY_HERE",
26-30: Casing nit: “Windsurf” brand casing.Use “Windsurf” (single capital W) for consistency with the product name.
-<TabsTrigger value="windsurf">WindSurf</TabsTrigger> +<TabsTrigger value="windsurf">Windsurf</TabsTrigger>
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
apps/portal/src/app/ai/mcp/page.mdx(5 hunks)
🧰 Additional context used
🧠 Learnings (4)
📚 Learning: 2025-07-18T19:19:55.613Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-07-18T19:19:55.613Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{ts,tsx} : Import UI primitives from `@/components/ui/*` (Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in dashboard and playground apps
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Prefer composable primitives over custom markup: `Button`, `Input`, `Select`, `Tabs`, `Card`, `Sidebar`, `Separator`, `Badge`.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Use `NavLink` (`@/components/ui/NavLink`) for internal navigation so active states are handled automatically.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*.{tsx,jsx} : Always import from the central UI library under `@/components/ui/*` – e.g. `import { Button } from "@/components/ui/button"`.
Applied to files:
apps/portal/src/app/ai/mcp/page.mdx
🪛 LanguageTool
apps/portal/src/app/ai/mcp/page.mdx
[grammar] ~2-~2: There might be a mistake here.
Context: ... Button } from "@/components/ui/button"; import { ArrowDownIcon } from "lucide-re...
(QB_NEW_EN)
[grammar] ~3-~3: There might be a mistake here.
Context: ...t { ArrowDownIcon } from "lucide-react"; import Link from "next/link"; # MCP ser...
(QB_NEW_EN)
[grammar] ~35-~35: There might be a mistake here.
Context: ...> <Button asChild className="flex items-center g...
(QB_NEW_EN)
[grammar] ~36-~36: There might be a mistake here.
Context: ...ntent value="cursor"> <Button asChild className="flex items-center gap-3 bg-ca...
(QB_NEW_EN)
[grammar] ~37-~37: There might be a mistake here.
Context: ...er:shadow-lg transition-shadow border-2" variant="outline" > <Link href="cursor...
(QB_NEW_EN)
[grammar] ~78-~78: There might be a mistake here.
Context: ...> <Button asChild className="flex items-center g...
(QB_NEW_EN)
[grammar] ~79-~79: There might be a mistake here.
Context: ...ntent value="vscode"> <Button asChild className="flex items-center gap-3 bg-ca...
(QB_NEW_EN)
[grammar] ~80-~80: There might be a mistake here.
Context: ...er:shadow-lg transition-shadow border-2" variant="outline" > <Link href="https:...
(QB_NEW_EN)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (7)
- GitHub Check: Unit Tests
- GitHub Check: E2E Tests (pnpm, webpack)
- GitHub Check: E2E Tests (pnpm, esbuild)
- GitHub Check: E2E Tests (pnpm, vite)
- GitHub Check: Size
- GitHub Check: Build Packages
- GitHub Check: Lint Packages
🔇 Additional comments (3)
apps/portal/src/app/ai/mcp/page.mdx (3)
2-4: UI imports look correct and consistent with our UI library usage.Using Button from "@/components/ui/button", lucide-react icon, and next/link aligns with our established patterns in Portal.
46-56: Good clarity on the Cursor manual config block.The JSON parses and the placeholder is standardized to YOUR_SECRET_KEY_HERE.
103-111: Claude Code command is clear and consistent with the placeholder scheme.No issues.
PR-Codex overview
This PR updates the documentation for integrating the MCP server with various clients, enhancing user guidance by adding buttons for installation links and adjusting the secret key placeholder in configuration examples.
Detailed summary
Buttoncomponent with a link for installing the MCP server inCursor..cursor/mcp.jsonexample.Buttoncomponent with a link for installing the MCP server in VS Code..vscode/mcp.jsonexample.Summary by CodeRabbit
New Features
Documentation